import React from 'react';
import Sequence from './sequence';
import mockData from './mock-data.json';

export default class Diagram extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    // console.log(this.formatData(mockData))
    this.Sequence = new Sequence(this.formatData(mockData));
  }

  formatData(result) {
    const xData = result.vertexList
      .filter(t => t.propertyMap.label === 'Account')
      .map(({ propertyMap, id }) => ({
        id,
        label: propertyMap.zhmc[0],
        notice: propertyMap.yxjgmc ? propertyMap.yxjgmc[0] : '暂无',
      }));
    const yData = result.edgeList
      .filter(t => t.propertyMap.label === 'Fund')
      .map(item => ({
        source: item.source,
        target: item.target,
        value: {
          amount: item.propertyMap.jyje,
          time: item.propertyMap.hxjysj,
        },
      }))
      .sort((a, b) => (a.value.time < b.value.time ? -1 : 1));
    return { xData, yData };
  }

  render() {
    return (
      <div className="diagram">
        <svg id="diagram" width="100%" height="100%"></svg>
      </div>
    );
  }
}
